<script setup lang="ts">
import DemoBox from '@/components/DemoBox/DemoBox.vue';
import ClipCode from '../clip/Clip.vue?raw';
import Clip from '../clip/Clip.vue';
import PageLayout from '@/components/PageLayout.vue';
</script>

<template>
    <PageLayout>
        <DemoBox :libs="[]" title="介绍">
            <p>下面演示的是如何在 canvas 元素上打洞</p>
        </DemoBox>

        <DemoBox :code="ClipCode" :libs="[]" title="反向裁剪">
            <Clip />
            <template #description> Three.js 基础用法</template>
        </DemoBox>
    </PageLayout>
</template>

<style lang="scss" scoped>
p {
    padding: 10px;
    color: #666666;
}
</style>
